<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE>
<html>
<head>
<base href="<%=basePath%>">
<jsp:include page="/static/iframe/import/_meta.jsp"></jsp:include>
<jsp:include page="/static/iframe/import/_header.jsp"></jsp:include>
<link rel="stylesheet"
	href="static/iframe/bootstrap/css/bootstrap.min.css" />
<link rel="stylesheet"
	href="static/iframe/bootstrap/css/bootstrapValidator.min.css">
<link rel="stylesheet"
	href="static/iframe/bootstrap/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css">
<title>用户管理</title>

<style>
.row {
	margin-right: 5px;
	margin-left: 5px;
	margin-top: 5px;
}

.form-bottom {
	margin-bottom: 10px;
}
</style>
</head>
<body>

	<div class="page-container">
		<div class="container-fluid">
			<form action="user/addUser" class="form-horizontal" method="post" id="myform">
				<div class="row">
					<div class="col-sm-4 col-md-4 col-lg-3 input-margin-bottom form-group">
						<div class="input-group">
								<span class="input-group-addon"> <span class="text-danger">*&nbsp;</span>&nbsp;用&nbsp;户&nbsp;&nbsp;名&nbsp;
								</span> <input type="text" class="form-control" placeholder="用户名"
									name="userName" />
						</div>
					</div>

					<div class="col-sm-4 col-md-4 col-lg-3 input-margin-bottom form-group">
						<div class="input-group">
								<span class="input-group-addon"><span class="text-danger">*&nbsp;</span>&nbsp;密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码:</span>
								<input type="password" class="form-control" name="password"
									placeholder="密码" />
						</div>
					</div>

					<div class="col-sm-4 col-md-4 col-lg-3 input-margin-bottom form-group">
						<div class="input-group">
								<span class="input-group-addon"><span class="text-danger">*&nbsp;</span>&nbsp;确认密码:</span>
								<input type="password" class="form-control" name="surepassword"
									placeholder="确认密码" />
						</div>
					</div>

					<div class="col-sm-4 col-md-4 col-lg-3 input-margin-bottom form-group">
						<div class="input-group">
								<span class="input-group-addon"><span class="text-danger">*&nbsp;</span>&nbsp;真实姓名:</span>
								<input type="text" class="form-control" name="realName"
									placeholder="真实姓名" />
						</div>
					</div>

					<div class="col-sm-4 col-md-4 col-lg-3 input-margin-bottom form-group">
						<div class="input-group">
								<span class="input-group-addon"><span class="text-danger">*&nbsp;</span>&nbsp;性&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;别:</span>
								<select class="form-control" name="gender">
									<option selected="selected" value="">请选择</option>
									<option value="男">男</option>
									<option value="女">女</option>
								</select>
						</div>
					</div>

					<div class="col-sm-4 col-md-4 col-lg-3 input-margin-bottom form-group">
						<div class="input-group">
								<span class="input-group-addon"><span class="text-danger">*&nbsp;</span>&nbsp;出生年月:</span>
								<input type="text" class="form-control date" readonly="readonly"
									name="birthday" placeholder="出生年月" />
						</div>
					</div>

					<div class="col-sm-4 col-md-4 col-lg-3 input-margin-bottom form-group">
						<div class="input-group">
								<span class="input-group-addon"><span class="text-danger">*&nbsp;</span>&nbsp;薪&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;资:</span>
								<input type="text" class="form-control" name="salary"
									placeholder="薪资" />
						</div>
					</div>

					<div class="col-sm-4 col-md-4 col-lg-3 input-margin-bottom form-group">
						<div class="input-group">
								<span class="input-group-addon"><span class="text-danger">*&nbsp;</span>&nbsp;组&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;织:</span>
								<select class="form-control" name="organizationId">
									<option selected="selected" value="">请选择</option>
									<c:forEach items="${organizations}" var="org">
										<option value="${org.id}">${org.organizationName}</option>
									</c:forEach>
								</select>
						</div>
					</div>

					<div class="col-sm-4 col-md-4 col-lg-3 input-margin-bottom form-group">
						<div class="input-group">
								<span class="input-group-addon"><span class="text-danger">*&nbsp;</span>&nbsp;电&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;话:</span>
								<input type="text" class="form-control" name="telephone"
									placeholder="电话" />
						</div>
					</div>

					<div class="col-sm-4 col-md-4 col-lg-3 mb-50">
						<div class="form-group">
							<div class="input-group">
								<span class="input-group-addon">&nbsp;&nbsp;&nbsp;&nbsp;备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注:</span>
								<textarea class="form-control" placeholder="备注" rows="4"
									name="remark"></textarea>
							</div>
						</div>
					</div>
				</div>

				<div class="col-sm-12 col-md-12 col-lg-12 text-center">
					<div class="tooltip-demo">
						<div class="form-bottom">
							<button type="submit" class="btn btn-primary btn-sm">
								<i class="glyphicon glyphicon-ok"></i>&nbsp;提交
							</button>
							&nbsp;
							<button class="btn btn-success btn-sm" type="reset" id="reset">
								<i class="glyphicon glyphicon-refresh"></i>&nbsp;重置
							</button>
							&nbsp; <a class="btn btn-white" href="javascript:layer_close()"
								target="_blank"><i class="glyphicon glyphicon-share-alt"></i>&nbsp;返回</a>
						</div>
					</div>
				</div>
			</form>
		</div>
	</div>
</body>
<jsp:include page="/static/iframe/import/_footer.jsp"></jsp:include>
<script type="text/javascript"
	src="static/iframe/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="static/iframe/bootstrap/js/bootstrapValidator.min.js"></script>
<script type="text/javascript"
	src="static/iframe/bootstrap/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
<script type="text/javascript"
	src="static/iframe/bootstrap/bootstrap-datetimepicker/js/bootstrap-datetimepicker.zh-CN.js"></script>
<script type="text/javascript" src="static/plugins/window/layershow.js"></script>
<script type="text/javascript">
		$(function() {
			/*日期控件*/
			$(".date").datetimepicker({
				language : 'zh-CN', //显示中文
				format : 'yyyy-mm-dd', //显示格式
				minView : "month", //设置只显示到月份
				endDate : new Date(),
				autoclose : true, //选中自动关闭
				todayBtn : true, //显示今日按钮
				clearBtn : true
			//清空输入时间
			});

			//加载上级名称
			$("#myform")
					.bootstrapValidator(
							{
								feedbackIcons : {
									valid : 'glyphicon glyphicon-ok',
									invalid : 'glyphicon glyphicon-remove',
									validating : 'glyphicon glyphicon-refresh'
								},
								fields : {
									userName : {
										message : '用户名验证失败',
										validators : {
											 remote : {
												url : "user/checkUserName",
												message : "该用户已经使用!",
												delay : 500,
												type : 'post'
											}, 
											notEmpty : {
												message : '登录名不能为空'
											},
											stringLength : {
												min : 3,
												max : 10,
												message : '登录名长度必须在3到10位之间'
											}
										}
									},
									password : {
										message : '密码验证失败',
										validators : {
											notEmpty : {
												message : '密码不能为空'
											},
											stringLength : {
												min : 6,
												max : 15,
												message : '密码长度必须在6到15位之间'
											},
											regexp : {
												regexp : /^[a-zA-Z0-9_]+$/,
												message : '密码只能包含大写、小写、数字和下划线'
											},
											different : {
												field : 'userName',
												message : '密码不能和用户名相同'
											}
										}
									},
									surepassword : {
										message : '密码重复还没有验证',
										validators : {
											notEmpty : {
												message : '密码重复不能为空'
											},
											identical : {
												field : 'password',
												message : '两次密码不同请重新输入'
											}
										}
									},
									realName : {
										message : '真实姓名验证失败',
										validators : {
											notEmpty : {
												message : '真实姓名不能为空'
											},
											stringLength : {
												min : 2,
												max : 6,
												message : '真实姓名必须在2到6位之间'
											},
											regexp : {
												regexp : /^[\u4e00-\u9fa5]{0,}$/,
												message : '真实姓名只能包含中文'
											}
										}
									},
									gender : {
										message : '性别验证失败',
										validators : {
											notEmpty : {
												message : '请选择性别'
											}
										}
									},
									birthday : {
										message : '出生年月验证失败',
										validators : {
											notEmpty : {
												message : '出生年月不能为空'
											}
										}
									},
									salary : {
										message : '薪资验证失败',
										validators : {
											notEmpty : {
												message : '请给他一个基本工资'
											},
											numeric: {  
							                    message: '薪资必须是数字'  
							                },
							                stringLength: {/*长度提示*/
					                            max: 10,
					                            message: '薪资最大单位为亿'
					                        }
										}
									},
									telephone : {
										message : '电话验证失败',
										validators : {
											notEmpty : {
												message : '电话不能为空'
											},
											remote : {
												url : "user/checkTelephone",
												message : "该手机号已经使用!",
												delay : 500,
												type : 'post'
											}, 
											regexp : {
												regexp : /^0?(13[0-9]|15[012356789]|17[013678]|18[0-9]|14[57])[0-9]{8}$/,
												message : '电话号码格式错误,例：15574310212'
											}
										}
									},
									organizationId : {
										message : '组织验证失败',
										validators : {
											notEmpty : {
												message : '请选择组织名称'
											}
										}
									}
								}
							//做ajax请求用到
							}).on('success.form.bv', function(e) {
						e.preventDefault();
						var $form = $(e.target); //拿到form表单
						layer.load(2, {
							time : 1000
						});
						setTimeout(function() {
							//请求注册用户
							$.ajax({
								type : "post",
								url : "user/addUser",
								dataType : "json",
								data : $form.serialize(),
								success : function(result) {
									if (result.flag) {
										layer.msg(result.msg, {
											time : 1500,
											icon : 1
										});
										setTimeout(function() {
											window.parent.location.reload();
										}, 1500);
									} else {
										layer.msg(result.msg, {
											time : 1500,
											icon : 2
										});
									}
								}
							});
						}, 1000); 
					});

			 $("#reset").click(function() {
				$("#myform").data('bootstrapValidator').resetForm();

			});

		});

		
		//点击body时
		function onBodyDown(event) {
			if (!(event.target.id == "menuBtn"
					|| event.target.id == "menuContent" || $(event.target)
					.parents("#menuContent").length > 0)) {
				hideMenu();
			}
		}
	
	</script>


<!--[if lt IE 10]>
    <script type="text/javascript" src="static/plugins/js/input-placeholder/ieplaceholder.js"></script>
    <![endif]-->
</html>